import React, { Component } from 'react';
import { StyleSheet, TouchableOpacity, Clipboard, Image } from 'react-native';
import { Container, Content, View, Button, Text, Icon } from 'native-base';
import { ListItem, Avatar } from 'react-native-elements';
import { connect } from 'react-redux';
import Moment from 'moment';
import LinearGradient from 'react-native-linear-gradient';

import { Header } from '../../component';
import { Colors, Metrics } from '../../theme';


class UserLevel extends Component {
	constructor(props) {
		super(props);
		this.state = {
			
		}
	}


	UNSAFE_componentWillMount() {

	}

	componentDidMount() {
		
	}

	render() {
		return (
			<Container>
				<Header title="用户等级" onLeftPress={() => this.props.navigation.goBack()} />
				<Content>
					<View style={Styles.container}>
						<View style={Styles.myLvCont}>
							<LinearGradient style={{ flexDirection: "row",justifyContent: "space-between",alignItems: "center", paddingTop: 15, paddingBottom: 15, width: Metrics.screenWidth * 0.95,  borderRadius: 8 }} colors={[Colors.subjectJbZuo, Colors.subject]} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }}>
								<Image source={require('../../asserts/images/lv/lv3.png')} style={[Styles.barIcon,{marginLeft: 20}]} />
								<Text style={{ fontSize: 14, padding: 14, color: Colors.bai,marginRight: 10 }}>您是尊敬的：黄金用户</Text>
							</LinearGradient>
						</View>
						
						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv0.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV0</Text>
									<Text style={Styles.lvWsmSxf}>未实名认证用户</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费100%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>未认证</Text>
							</View>
						</View>

						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv1.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV1</Text>
									<Text style={Styles.lvWsmSxf}>实名认证用户</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费60%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>普通</Text>
							</View>
						</View>


						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv2.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV2</Text>
									<Text style={Styles.lvWsmSxf}>直推实名用户2名</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费40%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>白银</Text>
							</View>
						</View>


						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv3.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV3</Text>
									<Text style={Styles.lvWsmSxf}>直推实名用户6名</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费35%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>黄金</Text>
							</View>
						</View>

						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv4.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV4</Text>
									<Text style={Styles.lvWsmSxf}>直推实名用户40名</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费30%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>白金</Text>
							</View>
						</View>

						<View style={Styles.lvConten}>
							<View style={Styles.lvConten1}>
								<Image source={require('../../asserts/images/lv/lv5.png')} style={Styles.barIcon} />
								<View style={Styles.lvMargin}>
									<Text style={Styles.lvLvtext}>会员等级LV5</Text>
									<Text style={Styles.lvWsmSxf}>直推实名用户20名</Text>
									<Text style={Styles.lvWsmSxf}>提现手续费25%</Text>
								</View>
							</View>
							<View>
								<Text style={Styles.lvName}>钻石</Text>
							</View>
						</View>


					</View>
				</Content>
			</Container>
		);
	}

}

const mapStateToProps = state => ({
	logged: state.user.logged,
	token: state.user.token,
	phone: state.user.phone,
	nickName: state.user.nickName,
	head_portrait: state.user.head_portrait,
	inviteCode: state.user.inviteCode,
	position: state.user.position,
	regTime: state.user.regTime,
	level: state.user.level,

});

const mapDispatchToProps = dispatch => ({

});

export default connect(mapStateToProps, mapDispatchToProps)(UserLevel);

const Styles = StyleSheet.create({
	container: { flex: 1, backgroundColor: Colors.huiED, paddingBottom: 20 },
	myLvCont: {flexDirection: "row",justifyContent: "center",alignItems: "center",marginTop: 20},
	lvConten: {flexDirection: "row",justifyContent: "space-around",alignItems: "center",marginTop: 20},
	lvConten1: {flexDirection: "row",justifyContent: 'space-between',alignItems: "center"},
	lvMargin: {marginLeft: 20},
	lvLvtext: { color: Colors.hui33, fontSize: Metrics.fontSize16, lineHeight: 30},
	lvWsmSxf: { color: Colors.hui99, fontSize: Metrics.fontSize12},
	lvName:  { color: Colors.hui66, fontSize: Metrics.fontSize14, paddingLeft: 60},
	barIcon: { width: 66, height: 66 },
});